<%--
  Created by IntelliJ IDEA.
  User: zzz
  Date: 2023/1/3
  Time: 13:27
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>

<style>
    .Nav {
        background-color: #d1e0ce;
        height: 755px;
        position: absolute;
        left: 0;
        width: 250px;

    }

    .Nav .nav {
        height: 400px;
        display: flex;
        justify-content: space-around;
    }

    .nav-item {
        padding: 8px 25px;
    }

    .nav-item a {
        color: #696666;
        font-size: 20px;
    }
    .nav-item a:hover{
        color: #696666;
    }
    .active{
        background-color: #8fac99;
        font-size: 20px;


        margin:10px 20px;
        border-radius: 10px ;
    }
    .active a{
        color: #696666;
    }
    .active a:hover{
        color: #696666;
    }


</style>

<div class="Nav">
    <ul class="nav flex-column">
        <li class="nav-item">
            <a type="button" class="nav-link" aria-current="page"
               href="${pageContext.request.contextPath}/admin/user_list">用户管理</a>
        </li>
        <li class="nav-item">
            <a class="nav-link" href="${pageContext.request.contextPath}/admin/admin_list">管理员管理</a>
        </li>
        <li class="nav-item">
            <a class="nav-link" href="${pageContext.request.contextPath}/admin/pet_list">宠物管理</a>
        </li>
        <li class="nav-item">
            <a class="nav-link" href="${pageContext.request.contextPath}/admin/goods_list">宠物商品管理</a>
        </li>
        <li class="nav-item">
            <a class="nav-link" href="${pageContext.request.contextPath}/admin/post_list">领养帖子管理</a>
        </li>
    </ul>
</div>
<script type="text/javascript">
    //获取路由
    function getUrl() {
        let href = window.location.href
        let substring = href;
        let index = href.indexOf('/');
        while(index != -1)
        {
            console.log("index = " + index);
            substring = substring.substring(index+1,substring.length);
            console.log("substring: " + substring);
            index = substring.indexOf('/');
        }
        return substring;
    }

    //拿到路由
    let url = getUrl();
    //设置映射关系
    const map = new Map();
    map.set("user_list",1);
    map.set("admin_list",2);
    map.set("pet_list",3);
    map.set("goods_list",4);
    map.set("post_list",5);

    //标记当前目录
    var items = document.getElementsByClassName("nav-item");
    items[map.get(url)].className = "active";
</script>

